<template>
  <div class="app-container">
    <el-row>
      <el-col :span="24" class="top">
        <el-form :model="searchParams" ref="searchParams" :inline="true">
          <el-form-item label="名称" prop="unit">
            <el-input class="input" v-model="searchParams.name" maxlength='20' placeholder="请输入" clearable
              show-word-limit></el-input>
          </el-form-item>
          <el-form-item label="租户" v-if="passRole(['admin'])">
            <el-input class="input" v-model="searchParams.lessee" maxlength='20' placeholder="请输入" clearable
              show-word-limit></el-input>
          </el-form-item>
          <el-form-item>
            <el-button @click="handleSearch" type="primary" icon="el-icon-search"
              style="margin-left:40px">搜索</el-button>
          </el-form-item>
        </el-form>
        <el-form :model="searchParams" ref="searchParams" :inline="true" style="margin:10px 0">
        </el-form>
        <el-table :data="dataList" size='medium' border>
          <el-table-column label="标题" prop="title" :show-overflow-tooltip="true"/>
            <el-table-column label="页面标识" prop="pageeModel.name" :show-overflow-tooltip="true"/>
            <el-table-column prop="clientList" label="客户端" show-overflow-tooltip>
              <template slot-scope="scope">
                <div class="activity_con" v-for="(item, index) of scope.row.clientList" :key="index">
                  <div>{{item.appname}}【{{clientTypeDict[item.types]}}】</div>
                </div>
              </template>
            </el-table-column>
          <el-table-column prop="redact" label="操作" fixed="right" width="120">>
            <template slot-scope="{ row, index }">
              <el-button type="text" @click="operateAction('pageConfig', row)" size='medium'>排版</el-button>
            </template>
          </el-table-column>
        </el-table>
        <pagination style="background: #ffffff; height: 50px" v-show="totalSize > 0" :total="totalSize"
          :page.sync="page" :limit.sync="size" @pagination="getDataList" />
      </el-col>
    </el-row>
  </div>
</template>

<script>
import { findPageConfigList, deletePageConfigs } from '@/api/interface/pageConfig.js'
export default {
  components: { },
  data() {
    return {
      page: 1,
      size: 10,
      totalSize: 0,
      dataList: [],
      searchParams: {},
      multipleSelection: [],
      clientTypeDict: {'app': 'APP', 'minipro': '小程序', 'web': 'Web', 'h5': 'H5'}
      
    }
  },
  created() {
    this.getDataList()
  },
  methods: {
    handleSearch() {
      this.page = 1
      this.getDataList()
    },
    handleSelectionChange(val) {
      this.multipleSelection = val;
    },
    operateAction(scene, row) {
      switch (scene) {
        case 'pageConfig':
          if(row.pageeModel.name=='createOrder' || row.pageeModel.name=='createOrderForStock' || row.pageeModel.name=='applyAgent' || row.pageeModel.name=='mine' || row.pageeModel.name=='authLogin' || row.pageeModel.name=='duoshou'){
            this.$router.push({name: 'PageConfigSeting', query: { data: encodeURIComponent(JSON.stringify(row)) }})
          }else{
            this.$router.push({name: 'Composing', query: { data: encodeURIComponent(JSON.stringify(row)) }})
          }
          break;
        
        default:
          break;
      }
    },
    //数据请求-----------------------------------------------
    // 获取列表数据
    getDataList() {
      this.searchParams.page = this.page
      this.searchParams.size = this.size
      findPageConfigList(this.searchParams).then(res => {
        if (res.data.code == 10000) {
          this.totalSize = res.data.data.total_count
          this.dataList = res.data.data.list
        }
      });
    }
  },
}
</script>


<style lang="scss" scoped></style>
